<div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>类别管理-{$typeName}</h5>

            </div>

            <div class="ibox-content">

                <div class="filter-box">
                    <form class="filter-form" id="filter-form">
                        <div class="div-box">
                            <div class="form-div">名称:
                                <label><input style="width: 80px" type="text" name="title"/></label>
                            </div>
                            <!--<div class="form-div">-->
                                <!--<label>级别:-->
                                    <!--<select name="level">-->
                                        <!--<option value="">不限</option>-->
                                        <!--<option value="1">一级</option>-->
                                        <!--<option value="2">二级</option>-->
                                        <!--<option value="3">三级</option>-->
                                    <!--</select>-->
                                <!--</label>-->
                            <!--</div>-->
                            <div class="form-div">
                                <div onclick="filterFun()" class="filter-submit btn btn-sm btn-primary">搜索</div>
                            </div>
                        </div>
                    </form>


                    <div class="jqGrid_wrapper">
                        <table id="table_list_1"></table>
                        <div id="pager_list_1"></div>
                    </div>

                </div>
            </div>
        </div>

    </div>


    <!-- 自定义js -->
    <script src="/static/js/content.js?v=1.0.0"></script>


    <script>


        $(document).ready(function () {

            $.jgrid.defaults.styleUI = 'Bootstrap';
            // Examle data for jqGrid

            $("#table_list_1").jqGrid({
                datatype: "json", //将这里改为使用JSON数据
                url: '/category/index?moduleid={$moduleid}&parentid={$parentid}', //这是Action的请求地址
                mtype: 'POST',
                jsonReader: {
                    root: "data.data",
                    page: "data.current_page",
                    total: "data.last_page",
                    records: "data.total",
                    repeatitems: true,
                    id: "id"
                },
                // data: mydata,
                // datatype: "local",
                height: 550,
                // height: 'auto',
                autowidth: true,
                shrinkToFit: true,
                rowNum: 20,
                // rowList: [10, 20, 30],

                colNames: ['排序', 'id', '名称', '级别', '关联类目', '子类管理', '操作'],
                colModel: [
                    {name: 'listorder', index: 'listorder', width: 20},
                    {name: 'id', index: 'id', width: 20},
                    {name: 'title', index: 'title', width: 60, search: true},
                    {name: 'level', index: 'level', width: 60},
                    {name: 'types', index: 'types', width: 150, search: true},
                    {
                        width: 50,
                        name: 'id',
                        formatter: function (value, grid, rows, state) {
                            var str = null;
                            if (rows.level < 3) {
                                str = "<a class=\"btn btn-sm m-r-sm\" href=\"/category/index?moduleid={$moduleid}&parentid=" + rows.id + "\">所有子类</a>";
                            } else {
                                str = ''
                            }
                            return str
                        }
                    },
                    {
                        width: 100,
                        name: 'id',
                        formatter: function (value, grid, rows, state) {

                            var delBtnStr = "<a class=\"btn btn-danger btn-sm m-r-sm\" href=\"/category/delete?id=" + rows.id + "\">删除</a>",
                                ediBtnStr = "<a class=\"btn btn-primary btn-sm m-r-sm\" href=\"/category/edit?id=" + rows.id + "\">修改</a>";

                            return ediBtnStr + delBtnStr
                        }
                    }
                ],
                pager: "#pager_list_1",
                viewrecords: true,
                hidegrid: false,

            });

            // Add selection
            $("#table_list_1").setSelection(4, true);


            // Setup buttons
            $("#table_list_1").jqGrid('navGrid', '#pager_list_1', {
                edit: false,
                add: true,
                addtext: '新增',
                addfunc: function () {

                    location.href = '/category/add?moduleid={$moduleid}&parentid={$parentid}';

                },
                del: false,
                search: false
            }, {
                height: 200,
                reloadAfterSubmit: true
            });

            // Add responsive to jqGrid
            $(window).bind('resize', function () {
                $(window).unbind("onresize");
                var width = $('.jqGrid_wrapper').width();
                $("#table_list_1").setGridHeight($(window).height() - 50);
                $('#table_list_1').setGridWidth(width);
                $(window).bind("onresize", this);
            });
        });


        function getSelecteds() {
//获取多选到的id集合
            var ids = $("#table_list_1").jqGrid("getGridParam", "selarrrow");
//遍历访问这个集合
            var tempArr = [];
            $(ids).each(function (index, id) {
                //由id获得对应数据行
                var row = $("#table_list_1").jqGrid('getRowData', id);

                tempArr.push({id: row.id, check: row.check})
            })

            return tempArr;
        }
    </script>

    <script>
        // filterFun()
        function filterFun() {

            var filterData = $('#filter-form').serializeArray()
            console.log(filterData, $("#table_list_1"));
            //传入查询条件参数
            $("#table_list_1").jqGrid("setGridParam", {postData: filterData}).trigger("reloadGrid");

        }
    </script>

